<template>
	<view class="login">
		<view class="mpwx-login">
			<image class="logo" :src="logo" mode="heightFix"></image>
			<button size="lg" class="btn white flex row-center" @click="mnpLoginFun">
				<text>用户一键登录</text>
			</button>
			<view class="mt20" style="width: 100%">
				<u-checkbox v-model="isAgree" shape="circle">
					<view class="sm row">
						已阅读并同意
						<navigator class="primary" hover-class="none" url="/bundle/pages/server_explan/server_explan?type=0">
							《服务协议》
						</navigator>
						和
						<navigator class="primary" hover-class="none" url="/bundle/pages/server_explan/server_explan?type=1">
							《隐私协议》
						</navigator>
					</view>
				</u-checkbox>
			</view>
		</view>

		<mplogin-popup v-model="showLoginPop" :logo="logo" title="宠症智识" @close="closePopup" @update="handleSubmitInfo" />
		<!-- 阅读协议弹框 -->
		<u-modal :value="showModel" show-cancel-button :show-title="false" @confirm=";(isAgree = true), (showModel = false)" @cancel="showModel = false" confirm-color="#FF2C3C">
			<view class="comfirm-box">
				<view> 请先阅读并同意 </view>
				<view class="flex row-center">
					<navigator class="primary" hover-class="none" url="/bundle/pages/server_explan/server_explan?type=0">
						<view class="agreement">《服务协议》</view>
					</navigator>
					和
					<navigator class="primary" hover-class="none" url="/bundle/pages/server_explan/server_explan?type=1">
						<view class="agreement">《隐私协议》</view>
					</navigator>
				</view>
			</view>
		</u-modal>
	</view>
</template>

<script>
	import { mapMutations, mapActions, mapGetters } from 'vuex'
	import { getUserProfile } from '../../utils/login'
	import {currentPage} from '@/utils/tools.js'
	export default {
		data() {
			return {
				isWeixin: '',
				loginType: 0,
				smsCode: '',
				time: 59,
				canSendSms: true,
				telephone: '',
				text: '',
				showLoginPop: false,
				isAgree: false,
				showModel: false,
				isPhonelogin: 1,
				logo: 'https://jiaoguanyi008.oss-cn-shenzhen.aliyuncs.com/miniPro/images/imgs/downloaded-image%20(2).jpg',
				inviteCode: ''
			}
		},
		async onLoad(options) {
			if (options.inviteCode) {
				this.inviteCode = options.inviteCode
			}
		
		},
		methods: {
			...mapMutations(['LOGIN', 'LOGOUT']),
			...mapActions(['getUser']),
			async mnpLoginFun() {
				if (!this.isAgree) {
					this.showModel = true;
					return;
				}
				const {
					userInfo: { avatarUrl, nickName, gender }
				} = await getUserProfile();
				uni.showLoading({
					title: '登录中...',
					mask: true
				});
				const loginRes = await wx.login()
				let userInfo = {avatar: avatarUrl, nickname: nickName, gender: gender}
				const { result: { code, msg, data } } = await wx.cloud.callFunction({ name: 'user', data: { $url: 'login', addUser: userInfo, loginCode: loginRes.code } });
				if (code === 200) {
					let invitedUid = data.uid
					if (data.isNewUser) {
						if (this.inviteCode) {
							let inviteData = {inviteCode: this.inviteCode, invitedUid: invitedUid}
							const {result: {code, msg, data}} = await wx.cloud.callFunction({name: 'user', data: {$url: 'toShare', inviteData: inviteData}})
							if (code == 200) {
								console.log("邀请成功")
							}else{
								console.log("邀请失败")
							}
						}
						uni.hideLoading();
						this.showLoginPop = true;
						this.loginData = data;
					} else {
						uni.hideLoading();
						this.loginHandle(data);
					}
				} else {
					this.$toast({
						title: msg
					});
				}
			},
			async handleSubmitInfo(e) {
				const loginData = this.loginData || {}
				console.log("这是修改的数据", e)
				const { result: {code, msg, data}} = await wx.cloud.callFunction({name: 'user', data: {$url: 'update', updateId: loginData._id, updateData: e}})
				if (code == 200) {
					this.loginHandle(loginData)
				}
			},

			// 登录结果处理
			async loginHandle(data) {
				this.LOGIN(data)
				uni.hideLoading()
				// uni.navigateBack({
				// 	success() {
				// 		// 刷新上一页
				// 		const { onLoad, options } = currentPage()
				// 		onLoad && onLoad(options)
				// 	}
				// })
			
				uni.switchTab({
					url: '/pages/index/index'
				})
			},
			closePopup() {
				this.showLoginPop = false
			},
		}
	}
</script>

<style lang="scss">
	page {
		.login {
			height: 100vh;

			.mpwx-login {
				height: 100%;
				display: flex;
				flex-direction: column;
				align-items: center;
				padding: 0 60rpx;

				.logo {
					width: 180rpx;
					height: 180rpx;
					margin-bottom: 50rpx;
					margin-top: 200rpx;
				}

				.btn {
					background-color: $-color-primary;
					width: 100%;
					margin: 80rpx auto 0;
					height: 100rpx;
				}
			}

			.account-login {
				padding-top: 100rpx;
				display: flex;
				flex-direction: column;
				align-items: center;
				height: 100%;
				box-sizing: border-box;
				padding-left: 60rpx;
				padding-right: 60rpx;

				.logo {
					width: 180rpx;
					height: 180rpx;
					margin-bottom: 50rpx;
					margin-top: 50rpx;
				}

				.btn {
					background-color:  $-color-primary;
					width: 100%;
					margin-top: 80rpx;
					height: 100rpx;
				}

				.phonebtn {
					border: $-solid-border;
					margin-top: 50rpx;
					width: 100%;
					height: 100rpx;
				}

				.input {
					height: 100rpx;
					border-radius: 10rpx;
					width: 670rpx;
					border: $-solid-border;
					margin-top: 30rpx;
				}

				.sms-btn {
					border: 1px solid $-color-primary;
					width: 176rpx;
					height: 60rpx;
					box-sizing: border-box;
				}

				.wx-login {
					margin-top: 60rpx;

					.image {
						margin-top: 40rpx;
						width: 80rpx;
						height: 80rpx;
					}
				}
			}
		}
	}

	.comfirm-box {
		text-align: center;
		padding: 60rpx 0 70rpx 0;
	}

	.agreement {
		color: $-color-primary;
	}

	.inactive {
		opacity: 0.5;
	}
</style>